<template>
    <div>
        <div class="change-cont">
            <div class="sign">*为保证你的账号隐私，请及时修改初始密码</div>
            <label for="old">
                <div class="new-pasw">
                    <span>旧密码</span>
                    <input id="old" v-model="oldpassword" type="password">
                </div>
            </label>
            <label for="rest">
                <div class="new-pasw">
                    <span>新密码</span>
                    <input id="rest" v-model="newpassword" type="password">
                </div>
            </label>
            <label for="confirm">
                <div class="new-pasw">
                    <span>请确认新密码</span>
                    <input id="confirm" v-model="newpassword_confirm" type="password">
                </div>
                <button type="submit" class="apply" @click="submit">提交</button>
            </label>
        </div>
    </div>
</template>
<script>
import { resetPwd } from '@/api/login.js';
export default {
    data() {
        return {
            oldpassword: '',
            newpassword: '',
            newpassword_confirm: ''
        };
    },
    methods: {
        async submit() {
            const res = await resetPwd(this);
            this.$dialog.alert({
                message: res.msg
            });
            await this.$store.dispatch('user/logout');
            this.$router.replace('/login');
        }
    }
};
</script>
<style scoped>
.change-cont {
  width: 80%;
  margin: 0 auto;
}
.sign {
  font-size: 12px;
  color: #d94141;
  margin-top: 10%;
}
.new-pasw {
  border: 1px solid #e06363;
  margin: 5% auto;
  border-radius: 6px;
  padding: 1% 2%;
  font-size: 12px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.new-pasw input {
  background: none;
  color: #202124;
  font-size: 14px;
  height: 30px;
  line-height: 30px;
  border: none;
  text-align: right;
}
.apply {
  background: #e06363;
  width: 100%;
  height: 40px;
  line-height: 40px;
  border: none;
  border-radius: 6px;
  margin-top: 7%;
  color: #fff;
}
</style>

